<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript" src="js/jquery.min-1.8.js"></script>
	</head>
	<body>
		111111111111111111111111111111111111111111111111111111111111111111111111111111111
		<h4>size()-----获取 jq 对象里面的个数</h4>
		<span class="aaa">aaa</span>
		<span class="aaa">aaa</span>
		<span class="aaa">aaa</span>
		<span class="aaa">aaa</span>
		<p class="bbb"></p>
		<script type="text/javascript">
			$('.aaa').size();
			$('.bbb').html( '.aaa 的个数为：' + $('.aaa').size())
		</script>
		<hr />
		<!--*********************************************************************************-->
		
		22222222222222222222222222222222222222222222222222222222222222222222222222222222222222222
		<h4>length()</h4>
		<hr />
		<!--*********************************************************************************-->
		
		333333333333333333333333333333333333333333333333333333333333333333333333333333333333
		<h4>get(n)------获得第几个标签的值和名称</h4>
		<span class="abc">aaaaaaa</span>
		<span class="abc">bbbbbbb</span>
		<p id="bbb"></p>
		<script type="text/javascript">
			x=$('.abc').get(0);
			$('#bbb').text('第一个 .abc 的标签名+内容=' + x.nodeName + '+' + x.innerHTML)
		</script>
		<hr />
		<!--*********************************************************************************-->
		
		4444444444444444444444444444444444444444444444444444444444444444444444444444444444444444
		<h4>get(index)</h4>
		<hr />
		<!--*********************************************************************************-->
		
		555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555
		<h4>each(i)------遍历（序号）</h4>
		<p class="ccc">单击添加num属性</p>
		<p class="ccc">单击添加num属性</p>
		<p class="ccc">单击添加num属性</p>
		<p class="ccc">单击添加num属性</p>
		<script type="text/javascript">
		//方法一：
//			$('.ccc').each(function(i){
//				$('.ccc').get()[i].setAttribute('num',i+1)
//			});
//			$('.ccc').click(function(){
//				this.innerHTML=this.getAttribute('num')
//			})
			
		//方法二：
			//添加num属性
			$('.ccc').each(function(i){
				$(this).attr({'num':i+1})
			})
			//将num属性写入到标签中
			$('.ccc').click(function(){
				$(this).html($(this).attr('num'))
			})
		</script>		
		<hr />
		<!--***********************************************************-->
		
		666666666666666666666666666666666666666666666666666666666666666666666666666666666666666666
		<!--*********************************************************************************-->
		<h4>data(i)-----向jq 对象身上添加属性，不动标签，从性能上data比attr好</h4>
		<p class="ddd">单击显示行号，不动标签</p>
		<p class="ddd">单击显示行号，不动标签</p>
		<p class="ddd">单击显示行号，不动标签</p>
		<p class="ddd">单击显示行号，不动标签</p>
		<script type="text/javascript">
			$('.ddd').each(function(i){
				$(this).data({'num':i+1})
			})
			$('.ddd').click(function(){
				$(this).html($(this).data('num'))
			})
		</script>		
		
		7777777777777777777777777777777777777777777777777777777777777777777777777777777777777777
		<h4>index()</h4>
		<hr />
		
		<hr />
	</body>
</html>
